<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>卖车</title>
		<script type="text/javascript" src="../js/xadmin.js"></script>
		<script type="text/javascript" src="../js/jquery-2.2.4.min.js"></script>
		<link rel="stylesheet" href="../lib/layui/css/layui.css">
		<link rel="stylesheet" href="../css/font.css">
		<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
		<link rel="stylesheet" href="./css/xadmin.css">
		<script type="text/javascript" src="../lib/layui/layui.js" charset="utf-8"></script>
		<!-- favicon
		============================================ -->
		<link rel="shortcut icon" type="image/x-icon" href="img/favicon.ico">

		<!-- Google Fonts
		============================================ -->
		<link href='https://fonts.googleapis.com/css?family=Lato:400,400italic,900,700,700italic,300' rel='stylesheet' type='text/css'>

		<!-- Bootstrap CSS
		============================================ -->
		<link rel="stylesheet" href="./css/bootstrap.min.css">

		<!-- nivo slider CSS
		============================================ -->
		<link rel="stylesheet" href="lib/nivo-slider/css/nivo-slider.css" type="text/css" />
		<link rel="stylesheet" href="lib/nivo-slider/css/preview.css" type="text/css" media="screen" />

		<!-- Fontawsome CSS
		============================================ -->
		<link rel="stylesheet" href="css/font-awesome.min.css">

		<!-- owl.carousel CSS
		============================================ -->
		<link rel="stylesheet" href="css/owl.carousel.css">

		<!-- jquery-ui CSS
		============================================ -->
		<link rel="stylesheet" href="css/jquery-ui.css">

		<!-- meanmenu CSS
		============================================ -->
		<link rel="stylesheet" href="css/meanmenu.min.css">

		<!-- animate CSS
		============================================ -->
		<link rel="stylesheet" href="css/animate.css">

		<!-- style CSS
		============================================ -->
		<link rel="stylesheet" href="style.css">

		<!-- responsive CSS
		============================================ -->
		<link rel="stylesheet" href="css/responsive.css">

		<!-- modernizr JS
		============================================ -->
		<script src="js/vendor/modernizr-2.8.3.min.js"></script>

	</head>
	<body style="background-color: #FAFAFA;">
		<!--Mainmenu Start-->
		<div class="mainmenu-area hidden-sm hidden-xs">
			<div id="sticker">
				<div class="container">
					<div class="row">
						<div class="col-lg-12 col-md-12 hidden-sm">
							<div class="mainmenu" style="color: #007DDB;">
								<nav>
									<ul id="nav" style="text-align: center;">
										<li class="current"><a class="lfont" href="home.html">买车</a></li>
										<li><a href="sell.html">卖车</a></li>
										<li><a href="buy.html">求购</a></li>
										<li><a href="user.html">个人中心</a></li>
										<li><a href="login.html">安全退出</a></li>
									</ul>
								</nav>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<!--End of Mainmenu-->
		<br />
		<div class="line">&emsp;填写车辆信息 助您快速出手！</div>
		<br />
		<hr />

		<div class="">
			<div style="text-align: center; border-style: solid;margin:5px 300px;">
				<form class="layui-form" id="calForm">
					<div class="layui-form-item">
						<div class="layui-inline">
							<label class="layui-form-label">品牌:</label>
							<div class="layui-input-inline">
								<select name="brand" id="brand">
									<option value="">选择汽车品牌</option>
									<option value="6">大众</option>
									<option value="8">奔驰</option>
									<option value="8">宝马</option>
									<option value="6">别克</option>
									<option value="8">红旗</option>
									<option value="3">五菱</option>
									<option value="6">特斯拉</option>
								</select>
							</div>
							<label class="layui-form-label">汽车类型:</label>
							<div class="layui-input-inline">
								<select name="type" id="type">
									<option value="">选择汽车类型</option>
									<option value="3">轿车</option>
									<option value="12">跑车</option>
									<option value="8">商务车</option>
									<option value="8">越野车</option>
									<option value="3">电动车</option>
								</select>
							</div>
						</div>
					</div>
					<div class="layui-form-item">
						<div class="layui-inline">
							<label for="usedTime" class="layui-form-label">
								车龄
							</label>
							<div class="layui-input-inline">
								<select name="usedTime" id="usedTime">
									<option value="">选择车龄</option>
									<option value="3">3年以内</option>
									<option value="2">5年以内</option>
									<option value="1">5年以上</option>
								</select>
							</div>
							<label for="mileage" class="layui-form-label">
								行驶里程
							</label>
							<div class="layui-input-inline">
								<select name="mileage" id="mileage">
									<option value="">选择里程数</option>
									<option value="3">1万公里以内</option>
									<option value="2">5万公里以内</option>
									<option value="1">10万公里以内</option>
									<option value="0">10万公里以上</option>
								</select>
							</div>
						</div>
					</div>

					<div class="layui-form-item">
						<div class="layui-input-block">
							<button type="button" onclick="doSave2();" class="layui-btn" lay-submit="" lay-filter="demo2">快速估价</button>
							<button type="reset" onclick="clear2();" class="layui-btn">重置</button>
						</div>

					</div>
				</form>
				<div class="layui-form-item">
					<div class="layui-inline">
						<label class="layui-form-label" style="color: orange;font-size: 20px;width: 100px;">
							估价：
						</label>
						<div class="layui-input-inline" style="color: orange;font-size: 20px;width: 70px;">
							<p type="text" id="calPrice" name="calPrice" class="layui-input" style="color: orange;font-size: 20px;width: 80px;">
						</div>
						<label class="layui-form-label" style="color: orange;font-size: 20px;">
							万元
						</label>
						<label class="layui-form-label" style="width: 230px;">
							<p type="text" id="msg" style="color: red;">
						</label>
					</div>
				</div>
			</div>
		</div>
		<script>
			function clear2(){
				
				$("#calPrice").html("");
				$("#msg").html("");
			}
			
			//提交表单
			function doSave2() {
				$("#calPrice").html("");
				$("#msg").html("");
				var data = $("#calForm").serialize();
				$.get("http://localhost:8888/usedcar/car/calPrice?token=" + document.cookie.split(";")[0], data, function(response) {
					console.log(response);
					if (response.status == 200) {
						$("#calPrice").html(response.data);
					} else if (response.status == 400) {
						$("#msg").html("<b>请填写车辆品牌和类型！</b>");
					}
				});
			}
		</script>
		<!-- jquery
		============================================ -->
		<script src="js/vendor/jquery-1.11.3.min.js"></script>

		<!-- bootstrap JS
		============================================ -->
		<script src="js/bootstrap.min.js"></script>

		<!-- nivo slider js
		============================================ -->
		<script src="lib/nivo-slider/js/jquery.nivo.slider.js" type="text/javascript"></script>
		<script src="lib/nivo-slider/home.js" type="text/javascript"></script>

		<!-- wow JS
		============================================ -->
		<script src="js/wow.min.js"></script>

		<!-- meanmenu JS
		============================================ -->
		<script src="js/jquery.meanmenu.js"></script>

		<!-- owl.carousel JS
		============================================ -->
		<script src="js/owl.carousel.min.js"></script>

		<!-- price-slider JS
		============================================ -->
		<script src="js/jquery-price-slider.js"></script>

		<!-- scrollUp JS
		============================================ -->
		<script src="js/jquery.scrollUp.min.js"></script>

		<!--Countdown js-->
		<script src="js/jquery.countdown.min.js"></script>

		<!-- Sticky Menu JS
		============================================ -->
		<script src="js/jquery.sticky.js"></script>

		<!-- Elevatezoom JS
		============================================ -->
		<script src="js/jquery.elevateZoom-3.0.8.min.js"></script>

		<!-- plugins JS
		============================================ -->
		<script src="js/plugins.js"></script>

		<!-- main JS
		============================================ -->
		<script src="js/main.js"></script>
	</body>
</html>
